<template>
    <div class="smooth">
        <div v-slide-in class="item">1</div>
        <div v-slide-in class="item">2</div>
        <div v-slide-in class="item">3</div>
        <div v-slide-in class="item">4</div>
        <div v-slide-in class="item">5</div>
        <div v-slide-in class="item">6</div>
        <div v-slide-in class="item">7</div>
        <div v-slide-in class="item">8</div>
        <div v-slide-in class="item">9</div>
        <div v-slide-in class="item">10</div>
        <div v-slide-in class="item">11</div>
    </div>
</template>
<script setup>

</script>
<style lang="scss">
.smooth {
    margin: 1em auto;
    width: 80%;
}

.item {
    width: 100%;
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: red;
    border-radius: 10px;
    box-shadow: -2px 4px 7px saddlebrown;
    margin-top: 20px;
}
</style>